<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>入职</title>
    <link rel="stylesheet" href="js/bstable/css/bootstrap.min.css">
    <link rel="stylesheet" href="js/bstable/css/bootstrap-table.css">
    <link rel="stylesheet" href="css/all.css">
</head>
<body>
<main>
    <div class="home-tab"><i class="tab-i"></i> 所在位置：<span>入职管理登录</span></div>
    <div class="find-top">
        <p class="p-tail"><i class="i-tail"></i> 该页面是介绍入职管理的详情的页面！主要实现入职信息的增，删，改查等操作</p>
    </div>
    <div class="find-top1">
      <table class="top-table">
          <tr><td class="top-table-label">职员编号：</td><td><input type="text"></td><td class="top-table-label">职员姓名：</td><td><input type="text"></td><td class="top-table-label">出生年月：</td><td><input type="date"></td></tr>
          <tr><td class="top-table-label">联系电话：</td><td><input type="text"></td><td class="top-table-label">联系邮箱：</td><td><input type="text"></td><td class="top-table-label">常住地址：</td><td><input type="text"></td></tr>

          <tr><td class="top-table-label">证件号码：</td><td><input type="text"></td><td class="top-table-label">证件类型：</td><td><select><option>第二代身份证</option></select></td><td class="top-table-label">性别：</td><td><input type="radio" checked="checked" name="sex"><span>男</span><input type="radio" name="sex"><span>女</span></td></tr>
          <tr><td class="top-table-label">学历：</td><td><select><option>研究生</option></select></td><td class="top-table-label">专业：</td><td><select><option>计算机</option></select></td><td class="top-table-label">毕业学院：</td><td><input type="text" ></td></tr>
          <tr><td class="top-table-label">毕业时间：</td><td><input type="date"></td><td class="top-table-label">工作时间：</td><td><input type="date"></td><td class="top-table-label">工作年限：</td><td><input type="text"></td></tr>
          <tr><td class="top-table-label">国籍：</td><td><select><option>中国</option></select></td><td class="top-table-label">民族：</td><td><select><option>汉族</option></select></td><td class="top-table-label">户籍地址：</td><td><input type="text" ></td></tr>
          <tr><td class="top-table-label">入职部门：</td><td><select><option>研发部</option></select></td><td class="top-table-label">工作岗位：</td><td><select><option>前端开发</option></select></td><td class="top-table-label">入职时间：</td><td><input type="date" ></td></tr>
          <tr><td class="top-table-label">实习时间：</td><td><input type="text"></td><td class="top-table-label">员工类型：</td><td><select><option>全职</option></select></td><td class="top-table-label">是否签订合同：</td><td><input type="radio" checked="checked" name="sex"><span>是</span><input type="radio" name="sex"><span>否</span></tr>
          <tr><td class="top-table-label">上传照片</td><td colspan="5"><input type="file"></td></tr>
          <tr><td class="top-table-label">上传档案</td><td colspan="5"><input type="file"></td></tr>
          <tr><td colspan="6" style="text-align: center"> <button class="add-but"><i class="glyphicon glyphicon-edit"></i> 提交</button> <button class="add-del"><i class="glyphicon glyphicon-remove"></i> 取消</button></td></tr>

      </table>
    </div>
    <div class="table-con">
        <table id="table1" class="table-style"></table>
    </div>

</main>
<script src="js/jquery.js"></script>
<script src="js/bstable/js/bootstrap.min.js"></script>
<script src="js/bstable/js/bootstrap-table.js"></script>
<script src="js/bstable/js/bootstrap-table-zh-CN.min.js"></script>
<script>
    $(function(){
        table1();

    })
    function table1(){
        $('#table1').bootstrapTable({
            method: "get",
            striped: false,
            singleSelect: false,
            url: "json/table1.json",
            dataType: "json",
            pagination: true, //分页
            pageSize: 10,
            pageNumber: 1,
            search: false, //显示搜索框
            contentType: "application/x-www-form-urlencoded",
            queryParams: null,
            columns: [
                {
                    title: "编号",
                    field: 'id',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '姓名',
                    field: 'title',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '出生日期',
                    field: 'date',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '性别',
                    field: 'sex',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '学历',
                    field: 'sex',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '部门',
                    field: 'sex',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '职位',
                    field: 'sex',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '类型',
                    field: 'sex',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '审核状态',
                    field: 'person',
                    align: 'center'
                },
                {
                    title: '操作',
                    field: 'opr',
                    width: 180,
                    align: 'center',
                    formatter: function (cellval, row) {
                        var  d = '<button  id="add" data-id="98" class="btn btn-xs btn-primary" onclick="add(\'' + row.ID + '\')">编辑</button> ';
                        var  c = '<button  id="add" data-id="98" class="btn btn-xs btn-primary" onclick="add(\'' + row.ID + '\')">删除</button> ';

                        return  d+c;
                    }
                }
            ]
        });
    }
</script>
</body>
</html>